<template>
  <div class="ad-form">
    <div class="ad-block">
      <el-form size="mini" inline label-position="right" label-width="auto" ref="form" :model="form" v-loading="isDisableForm" :disabled="isDisableForm" class="form">


        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="客户类型：" prop="type" :rules="[{required: true, message: '请选择'}]">
              <ad-status-select v-model="form.type" :dict="dict.customer_type" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否月结：" prop="nature" :rules="[{required: true, message: '请选择'}]">
              <ad-status-select v-model="form.nature" :dict="dict.yes_or_no" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="公司名称：" prop="companyName" :rules="[{required: true, message: '请输入'}]" v-if="showCompany">
          <el-input v-model="form.companyName" placeholder="请输入"/>
        </el-form-item>
        <el-row :gutter="10">
          <el-col :span="12">
            <el-form-item label="结算人：" prop="linkmanName" :rules="[{required: true, message: '请输入'}]">
              <el-input v-model="form.linkmanName" placeholder="请输入"/>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话：" prop="linkmanPhone" :rules="[{required: true, message: '请输入'}]">
              <el-input-number v-model.number="form.linkmanPhone" :controls="false" :min="0" :precision="0" placeholder="请输入" class="tel"/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="op">
      <el-button size="mini" type="primary" :loading="saving" @click="save">保存</el-button>
      <el-button size="mini" type="primary" plain @click="cancel">取消</el-button>
    </div>
  </div>
</template>

<script>
import AdInputNumber from '@/components/AdInputNumber'
import AdStatusSelect from '@/components/AdStatusSelect'
import adForm from '@/mixins/adForm'
import { add } from '@/api/settlement'

class Form {}

export default {
  components: { AdInputNumber,AdStatusSelect },
  mixins: [adForm({add})],
  dicts: ['customer_type','yes_or_no'],
  data() {
    return {
      form: new Form(),
      showCompany: true
    }
  },
  watch: {
    '$attrs.visible': {
      immediate: true,
      handler (visible) {
        if (visible) {
          if (this.$attrs.data) {
            console.log(this.$attrs.data)
            this.form.linkmanPhone = this.$attrs.data.linkmanPhone
          }
        }
      }
    },
    'form.type'(val) {
      this.showCompany = val != '3'
    }
  }
}
</script>

<style lang="scss" scoped>
.parent-inf { padding-bottom: 20px; }
.form { padding-top: 20px; }
</style>